<template>
  <div>
    <h1>修改密码</h1>
    <span>邮箱 :</span>
    <input type="text" v-model="userInfo.email">
    <span>验证码 :</span>
    <input type="text" v-model="userInfo.code">
    <button type="button" @click="sendCode()" :disabled="isDis">发送验证码{{num}}</button>
    <button type="button" @click="getPwdPage()">进入修改密码页面</button>
  </div>
</template>

<script>
  export default {
    name: "testUpdatePwd",
    data() {
      return {
        userInfo: {
          email: "767920412@qq.com",
          code: ""
        },
        isDis: false,
        num: "" //倒计时
      }
    },
    methods: {
      sendCode() { //发送验证码
        var self = this;
        //发送get请求
        this.$http.get("/userInfo/updatePwd", {
          params: this.userInfo
        }).then(function(rs) {
          console.log(rs.data);
          alert(rs.data.info);
          if (rs.data.success) {
            //禁用发送按钮
            self.isDis = true;
            //按钮计时
            self.num = 60;
            var time = setInterval(function() {
              self.num--;
              //判断倒计时是否结束
              if (self.num == 0) {
                //启动按钮
                self.isDis = false;
                self.num = "";
                //清除计时器
                clearInterval(time);
              }
            }, 1000)
          }
              
        }).catch(function(rs) {
          console.log("连接服务器错误");
        })

      },
      getPwdPage() { //进入修改页面
        var self = this;
        this.$http.post(
              "/userInfo/validateCode",
              this.$qs.stringify(this.userInfo)
              ).then(function(rs){
                  alert(rs.data.info);
                  if(rs.data.success){
                      //进入修改密码页面
                      self.$router.push({"name":"testUpdatePwd",query:{"email":self.userInfo.email}})
                  }
              }).catch(function(rs) {
                console.log("连接服务器错误");
            })

      }
    }
  }
</script>

<style>
</style>
